<!DOCTYPE HTML>
<html>

<head>
    <meta charset="utf-8"/>
    <title><%= config.name %></title>
    <!-- 新 Bootstrap 核心 CSS 文件 -->
    <link rel="stylesheet" href="/public/libs/bootstrap/css/bootstrap.min.css">

    <!-- 可选的Bootstrap主题文件（一般不用引入） -->
    <link rel="stylesheet" href="/public/libs/bootstrap/css/bootstrap-theme.min.css">

    <link rel="stylesheet" href="/public/stylesheets/animate.min.css"/>

    <link href="/public/javascripts/viewer/viewer.css" rel="stylesheet">

    <link href="/public/javascripts/webuploader/webuploader.css" rel="stylesheet">

    <link rel="stylesheet/less" type="text/css" href="/public/stylesheets/styles-bootcss.less">

    <script src="/public/javascripts/less.min.js"></script>

    <!-- jQuery文件。务必在bootstrap.min.js 之前引入 -->
    <script src="/public/javascripts/jquery.min.js"></script>

    <!-- 最新的 Bootstrap 核心 JavaScript 文件 -->
    <script src="/public/libs/bootstrap/js/bootstrap.min.js"></script>

    <script src="/public/javascripts/viewer/viewer.js"></script>

</head>

<body>
<!-- Fixed navbar -->
<nav class="navbar navbar-default ">
    <div class="container shufa-nav">
        <a class="navbar-brand" href="/"><strong><%= config.name %></strong></a>

        <div id="navbar" class="navbar-collapse collapse">
            <ul class="nav navbar-nav">
                <li><a href="#">发现</a></li>
                <li><a href="#about">关于</a></li>
            </ul>
            <div class="pull-right nav-container-right">

            </div>
        </div>
    </div>
</nav>
<div class="container">
    <div class="profile-container">
        <div class="profile-left">
            <div class="img-info">
                <div class="img-upload">
                    <img class="personal-img" src="http://7qn8ip.com1.z0.glb.clouddn.com/profile.png">
                    <span class="img-mask">修改头像</span>
                        <span class="uploading">
                            <img class="personal-upload-gif"
                                 src="https://assets-cdn.shimo.im/assets/images/loading-b67e5a67dc.gif">
                        </span>
                </div>
            </div>

        </div>
        <hr/>
        <div class="profile-right">
            <div class="profile-view profile-account active" type="account">
                <div class="info-item">
                    <span class="item-name info-name"><span class="hicon icon-user"></span>昵称</span>
                    <input class="user-name-input normal" data-type="name" current-data="萝卜" placeholder="昵称"
                           value="萝卜" id="username">
                </div>

                <div class="info-item">
                    <span class="item-name"><span class="hicon icon-email"></span>邮箱</span>
                    <span class="">
                        <span class="email-span">18620373425@126.com</span>
                        <a class="edit-email edit-btn" href="javascript:void(0);">修改邮箱</a>

                    </span>
                </div>

                <div class="info-item">
                    <span class="item-name"><span class="hicon icon-change-password"></span>密码</span>
                    <a class="edit-password edit-btn" href="javascript:void(0);">修改密码</a>
                </div>


            </div>
            <div class="profile-view profile-payment" type="payment">
                <div class="payment-header">
                    <div class="payment-first">订单号</div>
                    <div class="payment-second">支付时间</div>
                    <div class="payment-third">支付内容</div>
                    <div class="payment-fourth">支付金额</div>
                </div>
                <ul class="payment-list"></ul>
            </div>
            <div class="profile-view profile-notification " type="notification">
                <div class="noti-config">
                    <h4 class="noti-config-title">
                        <span class="hicon icon-email"></span>
                        邮件通知
                    </h4>

                    <p class="noti-config-info">系统会发送邮件至18620373425@126.com提醒你有新消息</p>

                    <div class="noti-config-switch sm-switch off" data-type="comment">
                        <div class="groove"></div>
                        <div class="stick"></div>
                    </div>
                </div>
                <div class="noti-config">
                    <h4 class="noti-config-title">
                        <span class="hicon icon-desktop"></span>
                        桌面通知
                    </h4>

                    <p class="noti-config-info">系统会弹出气泡提醒你有新消息（仅对 Chrome 、Firefox 和 Safari 浏览器有效）</p>

                    <div class="noti-config-switch sm-switch on" data-type="desktop">
                        <div class="groove"></div>
                        <div class="stick"></div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <div class="profile-edit">
        <div class="edit-box">
            <div class="edit-header">
                <span class="title"></span>
                <span class="icon-close hicon"></span>
            </div>
            <div class="edit-content">

                <div class="edit-item email-part">

                    <input type="password" placeholder="当前密码" name="password">
                    <input type="text" placeholder="新的邮箱" name="email">
                        <span class="to-find-password">
                            <span class="img-sprite"></span>
                        </span>

                </div>
                <div class="edit-item password-part">
                    <input type="password" placeholder="当前密码" name="password">
                    <input type="password" placeholder="新的密码" name="password_new">
                    <input type="password" placeholder="确认密码" name="password_confirm">
                        <span class="to-find-password">
                            <span class="img-sprite"></span>
                        </span>
                </div>
                <div class="edit-item reset-part">
                    <input type="email" placeholder="输入注册邮箱找回密码" name="email" readonly>
                </div>
                <div class="error-msg"></div>
            </div>
            <div class="edit-operation">
                <span class="edit-cancel btn">取消</span>
                <span class="edit-submit btn btn-ok">提交</span>
            </div>
            <div class="wechat-content">
                <div class="unbound-wechat-info">
                    <img class="qr-image" src="" alt="绑定微信"/>

                    <p>
                        微信扫一扫二维码
                        <br><br>
                        关注“石墨文档”完成绑定
                        <br><br>
                        即可在微信轻松管理你的文档
                    </p>
                </div>
            </div>
        </div>
    </div>

    <div id="confirm">
        <div class="dialog">
            <div class="dialog-head">
                <span class="header-text">确认框</span>
                <span class="hicon icon-close confirm-close"></span>
            </div>
            <div class="dialog-body">确认此操作吗？</div>
            <div class="dialog-foot">
                <div class="btn btn-ok">确认</div>
                <div class="btn btn-cancel">取消</div>
            </div>
        </div>
    </div>

</div>

<!--引入JS-->
<script type="text/javascript" src="/public/javascripts/webuploader/webuploader.js"></script>
<script type="text/javascript" >

    var _csrf = $('[name=_csrf]').val();

    var uploader = WebUploader.create({
        swf: '/public/javascripts/webuploader/Uploader.swf',
        pick:{id:'.img-mask'},
        server:'/upload?_csrf=' + _csrf
    });


</script>
<script>
    $(document).ready(function () {
        $('.edit-email').click(function () {
            $('.profile-edit').show();
            $('.email-part').show();
        });
    });
</script>

<div style="display:none;">
    <script>
        var _hmt = _hmt || [];
        (function() {
            var hm = document.createElement("script");
            hm.src = "https://hm.baidu.com/hm.js?c6cc56a5c39125422b6c9cc0607294b5";
            var s = document.getElementsByTagName("script")[0];
            s.parentNode.insertBefore(hm, s);
        })();
    </script>
</div>
</body>

</html>